<template>
  <el-container>
    <div class="personInfo_box">
        <el-form :label-position="labelPosition" ref="form" :model="form" :hide-required-asterisk="true" label-width="auto">
          <el-form-item label="姓名" required>
            <el-input v-model="form.name" disabled/>
          </el-form-item>
          <el-form-item label="性别">
            <el-radio-group v-model="form.sex"  required>
              <el-radio label="男"></el-radio>
              <el-radio label="女"></el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="出生日期" style="width: 100%">
            <el-col :span="11">
              <el-date-picker type="date" placeholder="选择日期" v-model="form.birthday" required></el-date-picker>
            </el-col>
          </el-form-item>
          <el-form-item label="入学日期" v-if="this.form.identity==='学生'" style="width: 100%">
            <el-col :span="11">
              <el-date-picker type="date" placeholder="选择日期" v-model="form.joinDate" disabled required></el-date-picker>
            </el-col>
          </el-form-item>
          <el-form-item label="入职日期" v-if="this.form.identity==='教师'||this.form.identity==='管理员'" style="width: 100%">
            <el-col :span="11">
              <el-date-picker type="date" placeholder="选择日期" v-model="form.joinDate" disabled required></el-date-picker>
            </el-col>
          </el-form-item>
          <el-form-item v-if="this.form.identity==='学生'" label="班级">
            <el-input v-model="form.classes.name" required disabled/>
          </el-form-item>
          <el-form-item v-if="this.form.identity==='学生'" label="学历">
              <el-input v-model="form.eduSystem" required disabled/>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="handleSave">保存</el-button>
          </el-form-item>
        </el-form>
    </div>
  </el-container>
</template>

<script>
import {updateStudent} from "@/api/student";
import {updateTeacher} from "@/api/teacher";
import {updateAdministrator} from "@/api/administrator";

export default {
  name: "PersonInfo",
  data(){
    return{
      form:JSON.parse(sessionStorage.getItem("user")),
      labelPosition:'left',
    }
  },
  methods:{
    handleSave(){
      if (this.form.identity==="学生"){
        updateStudent(this.form).then(res =>{
          if (res.code===0){
            sessionStorage.setItem("user",JSON.stringify(this.form));
            this.$message.success(res.message);
          }else {
            this.$message.error(res.message);
          }
        }).catch(res => {
          this.$message.error(res.code);
        })
      }else if (this.form.identity==="教师"){
        updateTeacher(this.form).then(res =>{
          if (res.code===0){
            sessionStorage.setItem("user",JSON.stringify(this.form));
            this.$message.success(res.message);
          }else {
            this.$message.error(res.message);
          }
        }).catch(res => {
          this.$message.error(res.code);
        })
      }else if (this.form.identity==="管理员"){
        updateAdministrator(this.form).then(res =>{
          if (res.code===0){
            sessionStorage.setItem("user",JSON.stringify(this.form));
            this.$message.success(res.message);
          }else {
            this.$message.error(res.message);
          }
        }).catch(res => {
          this.$message.error(res.code);
        })
      }
    }
  }
}
</script>

<style lang="less" scoped>
.el-container{
  width: 100%;
  min-height: calc(100vh - 122px);
  display:flex;
  align-items: center;/*垂直居中*/
  justify-content: center;/*水平居中*/
  .personInfo_box{
    padding-top: 50px;
    width: 450px;
    height: 450px;
    border-radius: 15px;
    box-shadow: 0 0 10px #ddd;
    display: flex;
    justify-content: center;
  }
}
</style>